<%-- 
    Document   : agenda
    Created on : 19/08/2013, 11:45:02
    Author     : Thiago
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <title>SorriDent - O seu consultório odontológico em Florianópolis</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!-- Bootstrap -->
        <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css">
        <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
        <link href="/Consultorio/css/bootstrap.min.css" rel="stylesheet" media="screen">
        <link href="/Consultorio/css/estilo.css" rel="stylesheet" media="screen">
        <link href="/Consultorio/css/bootstrap-glyphicons.css" rel="stylesheet" media="screen">

        <!-- links para a agenda -->
        <link href='/Consultorio/fullcalendar/fullcalendar.css' rel='stylesheet' />
        <link href='/Consultorio/fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />
        <script src='/Consultorio/jquery/jquery-1.10.2.min.js'></script>
        <script src='/Consultorio/jquery/jquery-ui-1.10.3.custom.min.js'></script>
        <script src='/Consultorio/fullcalendar/fullcalendar.min.js'></script>

        <!-- JavaScript plugins (requires jQuery) -->
        
        <!-- Include all compiled plugins (below), or include individual files as needed -->
        <script src="/Consultorio/js/bootstrap.min.js"></script>

        <!-- Enable responsive features in IE8 with Respond.js (https://github.com/scottjehl/Respond) -->
        <script src="/Consultorio/js/respond.js"></script>
        <script>

            $(document).ready(function() {


                /* initialize the external events
                 -----------------------------------------------------------------*/

                $('#external-events div.external-event').each(function() {

                    // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
                    // it doesn't need to have a start or end
                    var eventObject = {
                        title: $.trim($(this).text()) // use the element's text as the event title
                    };

                    // store the Event Object in the DOM element so we can get to it later
                    $(this).data('eventObject', eventObject);

                    // make the event draggable using jQuery UI
                    $(this).draggable({
                        zIndex: 999,
                        revert: true, // will cause the event to go back to its
                        revertDuration: 0  //  original position after the drag
                    });

                });


                /* initialize the calendar
                 -----------------------------------------------------------------*/

                $('#calendar').fullCalendar({
                    header: {
                        left: 'prev,next today',
                        center: 'title',
                        right: 'month,agendaWeek,agendaDay'
                    },
                    editable: true,
                    droppable: true, // this allows things to be dropped onto the calendar !!!
                    drop: function(date, allDay) { // this function is called when something is dropped

                        // retrieve the dropped element's stored Event Object
                        var originalEventObject = $(this).data('eventObject');

                        // we need to copy it, so that multiple events don't have a reference to the same object
                        var copiedEventObject = $.extend({}, originalEventObject);

                        // assign it the date that was reported
                        copiedEventObject.start = date;
                        copiedEventObject.allDay = allDay;

                        // render the event on the calendar
                        // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
                        $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);

                        // is the "remove after drop" checkbox checked?
                        if ($('#drop-remove').is(':checked')) {
                            // if so, remove the element from the "Draggable Events" list
                            $(this).remove();
                        }

                    }
                });


            });

        </script>
    </head>
    <body>
        <div class="container">
            <div id="header">
                <div class="navbar navbar-static-top navCon" style="float:left">
                    <a class="navbar-brand corTexto" href="#">SorriDent</a>
                    <ul class="nav navbar-nav">
                        <li><a href="/Consultorio/admin/perfilAdmin.jsp">Perfil</a></li>
                        <li><a href="/Consultorio/admin/consultaAdmin.jsp">Consultas</a></li>
                        <li class="bordaNav"><a href="/Consultorio/admin/agenda.jsp">Agenda</a></li>
                        <li><a href="/Consultorio/admin/examesAdmin.jsp">Exames</a></li>
                    </ul>
                </div>
                <div id="login">
                    <form method="POST" action="/Consultorio/ServletUsuario?cmd=sair">
                    <span class="input-group">Seja bem vindo(a)</span> <input class="btn btn-default" value="Sair" type="submit" style="padding: 0; width: 40px; float:right; margin-right: 35px; font-size: 12px; color:#428bca;" /> 
                    </form>
                </div>
            </div>   
        </div>
        <div class="container" style="margin-top: 40px">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h3 class="panel-title" style="float:left; font-weight: bolder; font-size: 18px"><a href="/Consultorio/admin/agenda.jsp" style="text-decoration:none">Agenda</a></h3>
                    <h3 class="tituloPainel"><a href="#">Estatísticas</a></h3>
                </div>
                <div class="conteudo_admin">
                    <div id="wrap">

                        <div id="external-events" style="margin-top: 50px; margin-right: -20px">
                            <h4>Consultas para agendar</h4>
                            <div class="external-event">Rafaela Back - Ortodontia</div>
                            <p>
                                <input type="checkbox" id="drop-remove" /> <label for="drop-remove">remove after drop</label>
                            </p>
                        </div>

                        <div id="calendar" style="padding:50px"></div>

                        <div style="clear: both"></div>
                    </div>
                </div>
                </body>
                </html>
